<template>
	<view class="container" :style="{'padding-top':topheight+'px'}">
		<!-- 导航栏 -->
		<navigation :showIcon="true" title="结单信息" @topHeight="topHeightFn">
			<view class="right_text" slot="right_text" style="position: relative;" v-if="orderSettle.status != undefined && orderSettle.status == 1 && btn.includes('save')">
				<uni-icons @click="showMore" type="more-filled" size="25"></uni-icons>
				<uni-transition :mode-class="['fade']" :show="isSHowAfterSale">
					<view class="right_text_top" style="transition: all 0.5s; ">
						<text class="operation_text" @click="transfer" v-if="orderSettle.status != undefined && orderSettle.status == 1 && btn.includes('check') && confirmStep.length > 0">转交</text>
						<text class="operation_text" v-if="orderSettle.status != undefined && orderSettle.status == 2 || orderSettle.status == 1 && btn.includes('save')"
						 @click="editOrder">编辑</text>
					</view>
				</uni-transition>
			</view>
		</navigation>

		<view class="settlement-img" v-if="order.settlement_status == 2">
			<image src="../../../static/orderImgs/settlement/settlement.png" mode=""></image>
		</view>
		<!-- 订单基本信息 -->
		<view class="settle-info">
			<view class="settle-title"> {{ order.company }}<text>结算单</text> </view>
			<view class="row">
				<view class="col">签单人：{{order.user.realname}}</view>
				<view class="col">签单时间：{{order.sign_date.substring(0,10)}}</view>
			</view>
			<view class="row">
				<view class="col">举办日期：{{order.event_date.substring(0,10)}}</view>
				<view class="col">新人姓名：{{order.bridegroom}} <text v-if="order.bridegroom && order.bride">,</text> {{order.bride}}</view>
			</view>
			<view class="row">
				<view class="col">酒店：{{order.hotel}}</view>
				<view class="col">厅：{{order.banquet_hall_name}}</view>
			</view>
			<view class="row">
				<view class="col">制单人：{{orderSettle.user != undefined ? orderSettle.user.realname : ''}}</view>
				<view class="col">所属区域：{{order.department}}</view>
			</view>
			<view class="row">
				<view class="col">合同模式：{{order.cooperation_mode}}</view>
				<view class="col">订单性质：{{order.news_type}}</view>
			</view>
			<view class="row">
				<view class="col">渠道来源：{{ order.source_text }}</view>
				<view class="col">会员积分：{{ order.score }}</view>
			</view>
			<view class="row">
				<view class="col">桌数：{{ checkObjLenth(banquet) ? banquet.table_amount : 0 }}</view>
				<view class="col">合同餐标：{{ checkObjLenth(banquet) ? banquet.table_price : 0 }}</view>
				<view class="col">服务费用：{{ banquet.service_fee ? banquet.service_fee : 0 }}</view>
			</view>
			<view class="row">
				<view class="col">换菜加菜：{{ priceType.modify_vegetable }}</view>
				<view class="col">加桌餐标：{{ priceType.modify_table }}</view>
				<view class="col">酒水费用：{{ banquet_other_fee.wine }}</view>
			</view>
			<view class="row">
				<view class="col">进场费用：{{ order.jinchang_fee ? order.jinchang_fee : 0 }}</view>
				<view class="col">糕点费用：{{ banquet_other_fee.dessert }}</view>
				<view class="col">草坪仪式：{{ priceType.lawn }}</view>
			</view>
			<view class="row">
				<view class="col">投影LED：{{ banquet_other_fee.led }}</view>
				<view class="col">仪式堂：{{ priceType.ritual }}</view>
				<view class="col">婚房费用：{{ banquet_other_fee.wedding_room }}</view>
			</view>
			<view class="row">
				<view class="col">喜糖费用：{{ banquet_other_fee.sugar }}</view>
				<view class="col">婚车费用：{{ banquet_other_fee.car }}</view>
				<view class="col">停车费用：{{ banquet_other_fee.part }}</view>
			</view>
			<view class="row">
				<view class="col">
					<text>赠送项目：</text>
					<text v-for="(item,index) in otherFree" :key="index">
						<text v-if="item.id != 0">
							<text>{{ item.title }}[{{ item.id }}]</text>
							<text v-if="index + 1 < otherFree.length ">，</text>
						</text>
					</text>
				</view>
			</view>
		</view>

		<!-- 需输入的信息 -->
		<view class="settle-data">
			<view class="row">
				<view class="col">与客结算：{{ priceType.income }}</view>
				<view class="col">酒店结算：{{ priceType.payment }}</view>
			</view>
			<view class="row">
				<view class="col" v-if="orderSettle.length == 0">
					公司应收：{{ (priceType.income - priceType.payment + parseFloat(orderOrigin.settle_real_total) - parseFloat(priceType.wedding_package_price)).toFixed(2) }}
				</view>
				<view v-else>公司应收：{{ (priceType.income - priceType.payment + parseFloat(orderSettle.settle_real_total) - parseFloat(priceType.wedding_package_price)).toFixed(2) }}</view>
			</view>
			<view class="row">
				<view class="col">返佣款:</view>
				<view class="col">
					<input v-if="orderSettle.length == 0" class="settle-input" @input="costChange" v-model="orderOrigin.settle_real_total"
					 type="digit" placeholder="请输入" />
					<input v-else class="settle-input" @input="costChange" :disabled="!isEditOrder" v-model="orderSettle.settle_real_total"
					 type="digit" placeholder="请输入" />
				</view>
			</view>
			<view class="row">
				<view class="col">渠道成本:</view>
				<view class="col">
					<input class="settle-input" v-if="orderSettle.length == 0" @input="costChange" v-model="apiParams.source_cost"
					 type="digit" placeholder="请输入" />
					<input class="settle-input" v-else @input="costChange" :disabled="!isEditOrder" v-model="orderSettle.source_cost"
					 type="digit" placeholder="请输入" />
				</view>
			</view>
			<view class="row">
				<view class="col">酒水成本:</view>
				<view class="col">
					<input class="settle-input" v-if="orderSettle.length == 0" @input="costChange" v-model="apiParams.wine_cost" type="digit"
					 placeholder="请输入" />
					<input class="settle-input" v-else @input="costChange" :disabled="!isEditOrder" v-model="orderSettle.wine_cost"
					 type="digit" placeholder="请输入" />
				</view>
			</view>
			<view class="row">
				<view class="col">喜糖成本:</view>
				<view class="col">
					<input class="settle-input" v-if="orderSettle.length == 0" @input="costChange" v-model="apiParams.sugar_cost" type="digit"
					 placeholder="请输入" />
					<input class="settle-input" v-else @input="costChange" :disabled="!isEditOrder" v-model="orderSettle.sugar_cost"
					 type="digit" placeholder="请输入" />
				</view>
			</view>
			<view class="row">
				<view class="col">积分成本:</view>
				<view class="col">
					<input class="settle-input" v-if="orderSettle.length == 0" @input="costChange" v-model="apiParams.score_cost" type="digit"
					 placeholder="请输入" />
					<input class="settle-input" v-else @input="costChange" :disabled="!isEditOrder" v-model="orderSettle.score_cost"
					 type="digit" placeholder="请输入" />
				</view>
			</view>
			<view class="row">
				<view class="col">婚车成本:</view>
				<view class="col">
					<input class="settle-input" v-if="orderSettle.length == 0" @input="costChange" v-model="apiParams.car_cost" type="digit"
					 placeholder="请输入" />
					<input class="settle-input" v-else @input="costChange" :disabled="!isEditOrder" v-model="orderSettle.car_cost"
					 type="digit" placeholder="请输入" />
				</view>
			</view>
			<view class="row">
				<view class="col">赠送项目成本:</view>
				<view class="col">
					<input class="settle-input" v-if="orderSettle.length == 0" @input="costChange" v-model="apiParams.free_cost" type="digit"
					 placeholder="请输入" />
					<input class="settle-input" v-else @input="costChange" :disabled="!isEditOrder" v-model="orderSettle.free_cost"
					 type="digit" placeholder="请输入" />
				</view>
			</view>
			<view class="row" v-if="orderOrigin.news_type == 2">
				<view class="col">{{ orderOrigin.news_type == 2 ? '婚庆套餐价' : '' }}</view>
				<view class="col">
					<view class="settle-input">{{ orderOrigin.news_type == 2 ? priceType.wedding_package_price : '' }}</view>
				</view>
			</view>
		</view>

		<!-- 添加其他费用 -->
		<view class="panel-other-price">
			<view class="panel-header">
				<view class="title">其他费用</view>
				<view class="more">
					<view class="add-btn">
						<!-- <button type="default" size="mini" @click="addCost">添加费用</button> -->
						<view class="add-text" @click="addCost" v-if="isEditOrder">添加费用</view>
					</view>
				</view>
			</view>
			<view class="panel-body">
				<!-- 其他费用列表 -->
				<view class="other-list" v-if="orderSettleOtherList.length > 0">
					<view class="row" v-for="(item,index) in orderSettleOtherList" :key="index">
						<view class="col">
							<view class="">费用名称：</view>
							<input type="text" disabled v-model="item.name" placeholder="请输入" />
						</view>
						<view class="col">
							<view class="">费用价格：</view>
							<input type="text" disabled v-model="item.price" placeholder="请输入" />
						</view>
						<!-- <button type="default" class="delete-btn" size="mini" @click="handleDelete(index,item)">删除</button> -->
						<view class="delete-text" @click="handleDelete(index,item)" v-if="isEditOrder">删除</view>
					</view>
				</view>

				<view class="other-list" v-else>
					<view class="row" v-for="(item,index) in otherList" :key="index">
						<view class="col">
							<view class="">费用名称：</view>
							<input type="text" disabled v-model="item.name" placeholder="请输入" />
						</view>
						<view class="col">
							<view class="">费用价格：</view>
							<input type="text" disabled v-model="item.price" placeholder="请输入" />
						</view>
						<!-- <button type="default" class="delete-btn" size="mini" @click="handleDelete(index,item)">删除</button> -->
						<view class="delete-text" @click="handleDelete(index,item)">删除</view>
					</view>
				</view>

			</view>
		</view>

		<!-- 备注 -->
		<view class="remark">
			<textarea v-if="orderSettle.length == 0" placeholder="请输入备注内容..." v-model="apiParams.settlement_remark" />
			<textarea v-else placeholder="请输入备注内容..." :disabled="!isEditOrder" v-model="orderSettle.settlement_remark" />
		</view>
		
		<!-- 附件 -->
		<view class="photo">
			<text>上传图片</text>
			<view class="img_list" style="display: flex;justify-content: left;">
				
				<view class="img_list" v-if="orderSettle.length == 0">
					<view class="addPic"  v-for="(item,index) in apiParams.images" :key="index">
						<image :src="item.url" mode="widthFix" @click="previewImg({list: apiParams.images,index: index})"></image>
					    <uni-icons @click="deleteImageArray(index,'image')" type="minus-filled" size="10" color="red" style="position: absolute;right:-30upx;top: 0;"></uni-icons>
					</view>
					
					<view class="addPic" @click="chooseImage('image')">
						<image src="@/static/add.png" mode=""></image>					
					</view>
				</view>
				
				<view class="img_list" v-else>
					<view class="addPic"  v-for="(item,index) in orderSettle.images" :key="index">
						<image :src="item.url" mode="widthFix" @click="previewImg({list: orderSettle.images,index: index})"></image>
					    <uni-icons @click="deleteImageArray(index,'image')" type="minus-filled" size="10" color="red" style="position: absolute;right:-30upx;top: 0;" v-if="isEditOrder"></uni-icons>
					</view>
				</view>
				
				<view class="addPic" v-if="orderSettle.status != undefined && orderSettle.status == 2 || orderSettle.status == 1 && btn.includes('save')">
					<image src="@/static/add.png" mode="" @click="chooseImage('image')" v-if="isEditOrder"></image>					
				</view>
			</view>
		</view>
		
		<!-- 老版审核记录 -->
		<view class="confirm-list" v-if="confirmList.length > 0">
			<divider title="审核流程"></divider>
			<step ref="step" :stepList="confirmList"></step>
		</view>
		
		<!-- 新版审核记录 -->
		<view class="confirm-list" v-if="confirmStep.length > 0">
			<divider title="审核流程"></divider>
			<steps-look ref="step" :stepList="confirmStep"></steps-look>
		</view>


		<!-- 修改记录 -->
		<divider title="修改记录" v-if="operateList.length > 0"></divider>
		<view class="action-box" v-for="(item,index) in operateList" :key="index">
			<view class="action-item">
				<view class="action-title">修改记录</view>
				<view class="action-text">修改人：{{item.user.realname}}</view>
				<view class="action-text">修改时间：{{item.create_time}}</view>
				<view v-for="(field,k) in item.changed_data" :key="k">
					<view v-if="fields[k] != undefined">
						<template v-if="k == 'status'">{{ fields[k] }}:{{ statusSet[field] }}</template>
						<template v-if="k == 'other_price'">
							<template v-if="Array.isArray(field)">
								<view class="action-text" v-for="(other, n) in field" :key="k + n">
									<text>{{other.name}}: </text>
									<text>{{other.price}}</text>
								</view>
							</template>
							<template v-else>
								<view class="action-text" v-for="(other, n) in JSON.parse(field)" :key="k + n">
									<text>{{other.name}}: </text>
									<text>{{other.price}}</text>
								</view>
							</template>
						</template>
						<template v-else>
							<view class="action-text">{{ fields[k] }}:{{ field }}</view>
						</template>
					</view>
				</view>
				<view class="action-text">毛利修改前：{{ item.before_update_data.gross_profit }} => 毛利修改后：{{item.changed_data.gross_profit ? item.changed_data.gross_profit : '毛利未变化'}}</view>
				<view class="action-img">
					<image src="@/static/images/wode_xiugaiyonghuming.png" mode=""></image>
				</view>
				<view class="action-line"></view>
			</view>
		</view>

		<view class="footer-btn">
			<view class="row">
				<view class="col">毛利:</view>
				<text class="settle-input" v-if="orderSettle.length == 0">{{ apiParams.gross_profit }}</text>
				<text class="settle-input" v-else>{{ orderSettle.gross_profit }}</text>
			</view>
			<view class="row btn-box">
				<view class="col mr10" style="display: flex;">
					<view>
						<button type="default" size="mini" @click="toOrderDetail(order.id)">订单详情</button>
					</view>
					<!-- <view v-if="orderSettle.status != undefined && orderSettle.status == 2 || orderSettle.status == 1">
						<button type="default" size="mini" style="margin-left: 5px;" >编辑</button>
					</view> -->
					<view v-if="orderSettle.status != undefined && orderSettle.status == 2 || orderSettle.status == 1 && btn.includes('save')">
						<button type="default" size="mini" style="margin-left: 5px;" @click="cancelOrder" v-if="isEditOrder">取消</button>
					</view>
					<view v-if="orderSettle.status != undefined && orderSettle.status == 2 || orderSettle.status == 1 && btn.includes('save')">
						<button type="default" size="mini" style="margin-left: 5px;" v-if="isEditOrder" @click="confirmEdit">确认</button>
					</view>
				</view>
				<view class="col">
					<view v-if="orderSettle.length == 0 && btn.includes('create')">
						<button type="default" size="mini" @click="submit">结单申请</button>
					</view>
					<view v-if="orderSettle.status != undefined && orderSettle.status == 1 && btn.includes('check')">
						<button type="default" size="mini" v-if="!isEditOrder" @click="confirmSubmit">结单</button>
					</view>
				</view>
			</view>

		</view>

		<!-- 添加弹窗 -->
		<view class="dialog" v-if="showDialog">
			<view class="panel">
				<view class="panel-header">
					<view class="title">添加其他费用</view>
				</view>
				<view class="panel-body">
					<view class="row">
						<view class="col dialog-text">费用名称：</view>
						<view class="col">
							<input type="text" v-model="otherCostForm.otherCost[0].name" placeholder="请输入" />
						</view>
					</view>
					<view class="row">
						<view class="col dialog-text">费用价格：</view>
						<view class="col">
							<input type="text" v-model="otherCostForm.otherCost[0].price" placeholder="请输入" />
						</view>
					</view>
				</view>
				<view class="panel-footer">
					<view class="row">
						<view class="rol">
							<button type="default" size="mini" @click="comfirmAdd">确认</button>
						</view>
						<view class="rol">
							<button type="default" size="mini" @click="hideDialog">取消</button>
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 转交弹窗 -->
		<view class="dialog" v-if="showTransferDialog">
			<view class="panel">
				<view class="panel-header">
					<view class="title">选择人员</view>
				</view>
				<view class="panel-body">
					<view class="row">
						<view class="col dialog-text">转交人员：</view>
						<view class="col">
							<input type="text" disabled v-model="transferForm.realname" placeholder="请选择" @click="changeUser" />
						</view>
					</view>
				</view>
				<view class="panel-footer">
					<view class="row">
						<view class="rol">
							<button type="default" size="mini" @click="comfirmBtn">确认</button>
						</view>
						<view class="rol">
							<button type="default" size="mini" @click="hideTransterDialog">取消</button>
						</view>
					</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import sun from '@/utils/request.js'
	import {checkObjLen} from '@/utils/common.js'
	import navigation from '@/component/navigation.vue'
	
	import step from '@/component/step/step'
	import stepsLook from '@/component/steps-look/steps-look.vue' // 新版审核流程
	import divider from '@/component/divider/divider'

	export default {
		components:{
			step,
			divider,
			stepsLook,
			navigation
		},
		data() {
			return {
				topheight: '',
				isSHowAfterSale: false, //是否显示操作
				showTransferDialog: false, // 转交弹窗
				
				order_id: '',

				// 添加费用弹窗
				showDialog: false,

				// 其他费用表单
				otherCostForm: {
					otherCost: []
				},
				
				btn: '', // 按钮权限
				
				isEditOrder: false, // 编辑结算单

				otherPrice: [], // 其他费用
				otherTotals: 0, // 其他费用总额

				priceType: {
					income: '', // 与客计算（收款金额）
					payment: '', // 酒店结算（付款金额）
					modify_table: '', // 加桌餐标
					modify_vegetable: '', // 加菜换菜
					lawn: 0, // 草坪仪式
					ritual: 0, // 仪式堂
					wedding_package_price: '' // 婚庆套餐总价
				},

				apiParams: {
					source_cost: 0, // 渠道成本
					wine_cost: 0, // 酒水成本
					sugar_cost: 0, // 喜糖成本
					score_cost: 0, // 积分成本
					car_cost: 0, // 婚车成本
					free_cost: 0, // 赠送项目成本
					gross_profit: '', // 毛利润
					settlement_remark: '',
					images: [] // 图片列表
				},
				
				banquet: {}, // 婚宴信息
				banquet_other_fee: {}, // 婚宴相关费用
				// 其他赠送项目
				otherFree: [],

				fields: {
					status: '结单状态',
					other_price: '其他费用',
					source_cost: '渠道成本',
					wine_cost: '酒水成本',
					sugar_cost: '喜糖成本',
					score_cost: '积分成本',
					car_cost: '婚车成本',
					free_cost: '赠送项目成本',
					gross_profit: '毛利润',
					settlement_remark: '结单备注'
				},
				
				statusSet: ['未提交，未审核', '已提交，待审核', '已提交,已审核'], // 审核状态

				// 其他费用发生更改
				other_price_changed: [],

				other_gross_profit: '',

				otherList: [], // 未提交申请的其他费用列表
				orderSettleOtherList: [], // 已提交申请的其他费用列表

				operateList: [], // 审核记录
				order: {
					user: {
						realname: ''
					},
					event_date: '',
					sign_date: ''
				}, // 订单数据，读取用
				orderOrigin: {}, // 订单原始数据，传参用
				orderSettle: [], // 订单结单提交数据
				
				transferForm: {
					realname: '',
					user_id: ''
				},
				confirmList: [], // 审核记录
				confirmStep: [], // 新版审核
			}
		},
		onLoad(options) {
			this.order_id = options.id
			this.getOrderInfo()
			this.topheight = sun.getStatusBarHeight()
		},
		methods: {
			topHeightFn(e) {
				this.topheight = e
			},
			
			// 右上角--更多
			showMore(){
				this.isSHowAfterSale = !this.isSHowAfterSale;
			},
			
			// 获取订单信息
			getOrderInfo() {
				let that = this
				sun.request({
					url: "/api/order.settlement/read",
					showLoading: true,
					token: true,
					data: {
						order_id: that.order_id
					},
					success(res) {
						if (res.code == 200) {
							let order = res.data
							that.order = order.order;
							that.confirmList = order.sequence;
							that.banquet = order.banquet;
							that.otherFree = order.free;
							that.banquet_other_fee = order.other;
							that.orderOrigin = order.orderOrigin;
							that.orderSettle = order.orderSettle;
							that.orderSettleOtherList = order.orderSettle.other_price ? order.orderSettle.other_price : [];
							that.priceType.modify_table = order.modify_table
							that.priceType.modify_vegetable = order.modify_vegetable
							that.priceType.lawn = order.lawn
							that.priceType.ritual = order.ritual
							that.priceType.income = order.income;
							that.priceType.wedding_package_price = order.wedding_package_price;
							that.priceType.payment = order.payment;
							that.operateList = order.operateList;
							that.btn = order.btn;
							that.getGrossProfit();
							that.getConfirmProcess();
							if (that.orderSettle.length == 0) {
									that.isEditOrder = true;
							} else {
									that.isEditOrder = false;
							}
						} else {
							uni.showToast({
								icon: "none",
								title: res.msg,
							})
						}
					},
					fail(e) {
						uni.showToast({
							icon: "none",
							title: "服务器开小差去啦~",
						})
					}
				})
			},
			
			// 获取审核流程
			getConfirmProcess() {
				let that=this;
				sun.request({
					url: '/api/order.settlement/getProcess',
					showLoading: true,
					token:true,
					data:{
						order_id: that.order_id
					},
					success(res) {
					  if(res.code==200){													
							let audit = res.data.audit;
							let auditProcess = res.data.process;
							if((Object.keys(audit).length == 0) || (Object.keys(audit).length > 0 && audit.current_audit_process)){
									that.confirmStep = auditProcess;
									that.confirmList = [];
							}
					  }else{
							 uni.showToast({
								icon:"none",
								title:res.msg
							 })	
					  }
					}
				})
			},
			
			// 判断对象长度
			checkObjLenth(data){
				if(checkObjLen(data)){
					return true
				}else{
					return false
				}
			},
			
			// 毛利
			getGrossProfit(){
				let that = this
				let otherTotals = 0
				if(that.orderSettle.length == 0){
					that.apiParams.gross_profit = (that.priceType.income - that.priceType.payment + parseFloat(that.order.settle_real_total) - that.priceType.wedding_package_price).toFixed(2)
				}else{
					let orderSettleOtherList = that.orderSettleOtherList;
					let len = orderSettleOtherList.length;
					for (let i = 0; i < len; i++) {
							otherTotals = otherTotals + parseFloat(orderSettleOtherList[i]['price']);
					}
					that.orderSettle.gross_profit =(
					that.priceType.income -
					that.priceType.payment +
					parseFloat(that.orderSettle.settle_real_total) -
					that.orderSettle.source_cost -
					that.orderSettle.wine_cost -
					that.orderSettle.sugar_cost -
					that.orderSettle.score_cost - 
					that.orderSettle.car_cost - 
					that.orderSettle.free_cost -
					that.priceType.wedding_package_price -
					otherTotals
					).toFixed(2)
				}
			},

			// 成本发生变化
			costChange() {
				let otherTotals = 0
				// 计算毛利：与客结算-酒店结算+返佣款-渠道成本-酒水成本-喜糖成本-婚庆套餐
				if (this.orderSettle.length == 0) {
					let otherList = this.otherList;
					let len = otherList.length;
					for (let i = 0; i < len; i++) {
							otherTotals = otherTotals + parseFloat(otherList[i]['price']);
					}
					let orderGrossProfit =
						this.priceType.income -
						this.priceType.payment +
						parseFloat(this.orderOrigin.settle_real_total) -
						this.apiParams.source_cost -
						this.apiParams.wine_cost -
						this.apiParams.sugar_cost - 
						this.apiParams.score_cost - 
						this.apiParams.car_cost - 
						this.apiParams.free_cost - 
						this.priceType.wedding_package_price - 
						otherTotals
					this.apiParams.gross_profit = orderGrossProfit.toFixed(2);
				} else {
					let orderSettleOtherList = this.orderSettleOtherList;
					let len = orderSettleOtherList.length;
					for (let i = 0; i < len; i++) {
							otherTotals = otherTotals + parseFloat(orderSettleOtherList[i]['price']);
					}
					let settleGrossProfit =
							this.priceType.income -
							this.priceType.payment +
							parseFloat(this.orderSettle.settle_real_total) -
							this.orderSettle.source_cost -
							this.orderSettle.wine_cost -
							this.orderSettle.sugar_cost -
							this.orderSettle.score_cost - 
							this.orderSettle.car_cost - 
							this.orderSettle.free_cost -
							this.priceType.wedding_package_price -
							otherTotals;
					this.orderSettle.gross_profit = settleGrossProfit.toFixed(2);
				}
			},

			// 添加其他费用
			addCost() {
				this.otherCostForm.otherCost.push({
					name: '',
					price: '',
				})
				this.showDialog = true
			},

			// 隐藏弹窗
			hideDialog() {
				this.showDialog = false
				this.otherCostForm.otherCost = []
			},

			// 删除已添加的其他费用
			handleDelete(index, data) {
				if (this.orderSettle.length == 0) {
					this.otherList.splice(index, 1);
					this.costChange()
				} else {
					this.orderSettleOtherList.splice(index, 1);
					this.costChange()
				}
			},

			// 删除其他费用
			deleteOtherPrice(index) {
				this.otherCostForm.otherCost.splice(index, 1)
			},

			// 确认新增
			comfirmAdd() {
				let otherPrice = this.otherCostForm.otherCost;
				if (this.orderSettle.length == 0) {
					for (let i in otherPrice) {
						if (otherPrice[i].name == '' || otherPrice[i].price == '') {
							uni.showToast({
								title: '其他费用须填写完整',
								icon: 'none'
							})
							return false;
						} else {
							let addOtherList = this.otherCostForm.otherCost;
							this.otherList = this.otherList.concat(addOtherList);
							this.costChange()
							this.otherCostForm.otherCost = []
							this.showDialog = false
						}
					}
				} else {
					for (let i in otherPrice) {
						if (otherPrice[i].name == '' || otherPrice[i].price == '') {
							uni.showToast({
								title: '其他费用须填写完整',
								icon: 'none'
							})
							return false;
						} else {
							let orderSettleOtherList = this.otherCostForm.otherCost;
							this.orderSettleOtherList = this.orderSettleOtherList.concat(orderSettleOtherList);
							this.costChange();
							this.otherCostForm.otherCost = []
							this.showDialog = false
						}
					}
				}
			},
			
			// 选择图片
			chooseImage(e) {
				 let _this =this;				 
				  if(this.isEdit){
					  return
				  }
				 uni.chooseImage({
				     count: 1, //默认9
				     sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有				     
				     success: function (res) {
				        _this.upImg(res.tempFiles,e)
				     }
				 });
			},
			
			// 上传图片
			upImg(data,e){
				let _this = this;
				uni.showLoading({title:'上传中',mask:true});
				var i = data.i ? data.i : 0;//当前上传的哪张图片
				var success = data.success ? data.success : 0;//上传成功的个数
				var fail = data.fail ? data.fail : 0;//上传失败的个数
				uni.uploadFile({
					url:sun.http+"/h5/order.upload/doupload",													
					filePath:data[i].path,
					header:{
						
					},
					name:'file',
					formData:{
						token:uni.getStorageSync("token")?uni.getStorageSync("token"):''
					},
					success: (res) =>{
						if (JSON.parse(res.data).msg == "上传成功"){
							success++;//图片上传成功，图片上传成功的变量+1
							uni.hideLoading()
						}								
						if(e == "image"){
							if(_this.orderSettle.length == 0){
								_this.apiParams.images.push({name: 'image' ,url: JSON.parse(res.data).data.url})
							}else{
								this.orderSettle.images.push({name: 'image' ,url: JSON.parse(res.data).data.url})
								
							}
						}
							
					},
					fail:()=>{
					 fail++;//图片上传失败，图片上传失败的变量+1
					},
					complete: () => {
						i++;//这个图片执行完上传后，开始上传下一张
						if (i == data.length) {   //当图片传完时，停止调用          
							uni.showToast({
								icon:'none',
								title: '成功：' + success + " 失败：" + fail,
							})
						} else {//若图片还没有传完，则继续调用函数
							data.i = i;
							data.success = success;
							data.fail = fail;
							_this.upImg(data,e);
						}
						
					}		
				})
			},
			
			//删除图片
			deleteImageArray(index,e){
				if(e == "image"){
					this.apiParams.images.splice(index,1)				   
				}
			},
			
			//预览图片
			previewImg(e) {
				let urls = []
				e.list.forEach((item)=>{
					urls.push(item.url)
				})
				// 预览图片
				uni.previewImage({
					current: e.index,
					urls: urls,
					longPressActions: {
						// itemList: ['发送给朋友', '保存图片', '收藏'],
						success: function(data) {
			
						},
						fail: function(err) {
						}
					}
				});
			},

			// 结单申请
			submit() {
				let that = this
				uni.showModal({
					title: '提示',
					content: '是否确认提交',
					success(res) {
						if (res.confirm) {
							let otherPrice = that.otherCostForm.otherCost;
							let params = Object.assign({
								order_id: that.order_id
							}, that.orderOrigin, that.priceType, that.apiParams, {
								other_price: that.otherList
							});
							if (that.apiParams.source_cost === '' || that.apiParams.wine_cost === '' || that.apiParams.sugar_cost === '' || that.apiParams.score_cost === '' || that.apiParams.car_cost === '' || that.apiParams.free_cost === '') {
								uni.showToast({
									icon: 'none',
									title: '渠道成本、酒水成本、喜糖成本、积分成本、婚车成本和其他赠送项目成本不能为空'
								})
								return false;
							} else {
								sun.request({
									url: "/api/order.settlement/create",
									showLoading: true,
									token: true,
									data: params,
									success(res) {
										if (res.code == 200) {
											uni.showToast({
												icon: "none",
												title: res.msg,
											})
											uni.navigateBack({
												delta: 1
											})
										} else {
											uni.showToast({
												icon: "none",
												title: res.msg,
											})
										}
									},
									fail(e) {
										uni.showToast({
											icon: "none",
											title: "服务器开小差去啦~",
										})
									}
								})
							}
						} else {
							uni.showToast({
								icon: 'none',
								title: '已取消'
							})
						}
					}
				})
			},
			// 确认结单
			confirmSubmit() {
				let that = this
				uni.showModal({
					title: '提示',
					content: '是否确认提交',
					success(res) {
						if (res.confirm) {
							let otherPrice = that.otherCostForm.otherCost;
							let params = Object.assign({
								order_id: that.order_id
							}, that.orderOrigin, that.priceType, that.orderSettle, {
								other_price: that.orderSettleOtherList
							});
							if (that.orderSettle.source_cost == '' || that.orderSettle.wine_cost == '' || that.orderSettle.sugar_cost =='' || that.orderSettle.score_cost === '' || that.orderSettle.car_cost === '' || that.orderSettle.free_cost === '') {
								uni.showToast({
									icon: 'none',
									title: '渠道成本、酒水成本、喜糖成本、积分成本、婚车成本和其他赠送项目成本不能为空'
								})
								return false;
							} else {
								sun.request({
									url: "/api/order.settlement/accept",
									showLoading: true,
									token: true,
									data: params,
									success(res) {
										if (res.code == 200) {
											uni.showToast({
												icon: "none",
												title: res.msg,
											})
											uni.navigateBack({
												delta: 1
											})
										} else {
											uni.showToast({
												icon: "none",
												title: res.msg,
											})
										}
									},
									fail(e) {
										uni.showToast({
											icon: "none",
											title: "服务器开小差去啦~",
										})
									}
								})
							}
						} else {
							uni.showToast({
								icon: 'none',
								title: '已取消'
							})
						}
					}
				})

			},
			
			// 编辑结算单
			editOrder(){
				this.isEditOrder = true;
				this.isSHowAfterSale = false;
			},
			
			// 转交
			transfer(){
				this.showTransferDialog = true;
				this.isSHowAfterSale = false;
			},
			
			// 跳转选择用户
			changeUser(){
				uni.navigateTo({
					url: '../../../component/search/search?type=' + 'changeUser'
				})
			},
			
			// 提交转交
			comfirmBtn(){
				let that=this;
				sun.request({
					url: '/api/order.settlement/transfer',
					showLoading: true,
					token:true,
					data:{
						order_id: that.orderSettle.order_id,
						user_id: that.transferForm.user_id
					},
					success(res) {
					  if(res.code==200){													
							uni.showToast({
								icon:"none",
								title:res.msg
							})		
							that.hideTransterDialog()
							uni.navigateBack({})
					  }else{
							 uni.showToast({
								icon:"none",
								title:res.msg
							 })	
					  }
					}
				})
			},
			
			// 隐藏弹窗
			hideTransterDialog() {
				this.showTransferDialog = false;
				this.transferForm = {
					realname: '',
					user_id: ''
				}
			},
			
			// 取消编辑
			cancelOrder(){
				this.isEditOrder = false
			},

			// 确认编辑
			confirmEdit() {
				let that = this
				uni.showModal({
					title: '提示',
					content: '是否确认提交',
					success(res) {
						if (res.confirm) {
							let otherPrice = that.otherCostForm.otherCost;
							let params = Object.assign({
								order_id: that.order_id
							}, that.orderOrigin, that.priceType, that.orderSettle, {
								other_price: that.orderSettleOtherList
							});
							if (that.orderSettle.source_cost == '' || that.orderSettle.wine_cost == '' || that.orderSettle.sugar_cost =='' || that.orderSettle.score_cost === '' || that.orderSettle.car_cost === '' || that.orderSettle.free_cost === '') {
								uni.showToast({
									icon: 'none',
									title: '渠道成本、酒水成本、喜糖成本、积分成本、婚车成本和其他赠送项目成本不能为空'
								})
								return false;
							} else {
								sun.request({
									url: "/api/order.settlement/save",
									showLoading: true,
									token: true,
									data: params,
									success(res) {
										if (res.code == 200) {
											uni.showToast({
												icon: "none",
												title: res.msg,
											})
											uni.navigateBack({
												delta: 1
											})
										} else {
											uni.showToast({
												icon: "none",
												title: res.msg,
											})
										}
									},
									fail(e) {
										uni.showToast({
											icon: "none",
											title: "服务器开小差去啦~",
										})
									}
								})
							}
						} else {
							uni.showToast({
								icon: 'none',
								title: '已取消'
							})
						}
					}
				})
			},

			// 订单详情
			toOrderDetail(e) {
				// uni.navigateTo({
				// 	url: '../../orderInfo/goodsDetail/goodsDetail?id=' + e
				// })
				uni.navigateTo({
					url: "../detail/detail?order_id=" + e
				})
			}

		}
	}
</script>

<style lang="less">
	page {
		padding: 0;
	}
	
	.mr10{
		margin-right: 20upx;
	}

	.container {
		position: relative;
		padding: 20upx 24upx 160upx 24upx;
		font-size: 28upx;

		.settlement-img {
			position: absolute;
			right: 0;
			width: 300upx;
			height: 300upx;
			z-index: 2;

			image {
				width: 100%;
				height: 100%;
			}
		}

		button {
			color: #fff;
			background-color: rgb(0, 122, 255);
		}

		input {
			font-size: 28upx;
		}

		.settle-info {
			border: 1px solid #ebedf0;

			.settle-title {
				padding: 20upx 0;
				font-size: 32upx;
				font-weight: 600;
				text-align: center;
				border-bottom: 1px solid #ebedf0;
			}
		}

		.settle-data {
			margin-top: 40upx;
			margin-bottom: 40upx;
			border: 1px solid #ebedf0;

			.settle-input {
				text-align: end;
			}
		}

		.panel-other-price {

			.panel-header {
				padding: 10upx 32upx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				border: 1px solid #ebedf0;

				.more {

					.add-btn {

						.add-text {
							text-align: right;
							color: rgb(0, 122, 255);
						}

					}

				}

			}

			.panel-body {
				border: 1px solid #ebedf0;

				.add-box {

					.confirm-btn {
						padding-top: 20upx;
						text-align: center;
					}

				}

			}



		}



		.action-box {
			padding: 2upx 40upx 0 40upx;
			font-size: 24upx;
			color: #999999;
			overflow: hidden;

			.action-item {
				position: relative;
				padding: 20upx 20upx 10upx 60upx;

				.action-title {
					margin-bottom: 10upx;
					font-size: 34upx;
					color: #000;
				}

				.action-text {
					padding: 10upx 0;
				}

				.action-img {
					position: absolute;
					top: 24px;
					left: 4px;
					z-index: 2;
					transform: translate(-50%, -50%);
					width: 60upx;
					height: 60upx;
					border-radius: 50%;

					image {
						width: 100%;
						height: 100%;
						border-radius: 50%;
					}

				}

				.action-line {
					position: absolute;
					top: 40px;
					left: 2px;
					width: 1px;
					height: 100%;
					background-color: #ebedf0;
					transition: background-color 0.3s;
				}
			}

		}
		
		.remark{
			margin-top: 20upx;
			padding: 20upx 32upx;
			border: 1px solid #ebedf0;
			
			textarea{
				font-size: 28upx;
			}
		}
		
		.photo{
			width: 100%;
			height: auto;
		    padding: 32upx 44upx;
			box-sizing: border-box;
			.img_list{
				display: flex;
				justify-content: left;
				flex-wrap: wrap;
			}
			text{
				width: 100%;
				display: inline-block;
				font-size: 30upx;
				color: #333333;
				margin-bottom: 10upx;
			}
			.addPic{
				position: relative;
				overflow: hidden;
				width: 88upx;
				height: 88upx;
				// border: 1px solid #CCCCCC;
				margin-right: 20upx;
				image{
					width: 88upx;
					height: 88upx;
				}
			}
		}

		.delete-btn {
			color: #fff;
			background-color: #F56C6C;
		}

		.delete-text {
			text-decoration: underline;
			color: #F56C6C;
		}

		.row {
			padding: 20upx 32upx;
			display: flex;
			align-items: center;
			border-bottom: 1px solid #ebedf0;
			font-size: 12px;

			.col {
				flex: 1;
				text-overflow: ellipsis;
				overflow: hidden;
				white-space: nowrap;
			}

			.col-right {
				text-align: end;
			}

		}

		.row:last-child {
			border: none;
		}

		.footer-btn {
			position: fixed;
			left: 0;
			right: 0;
			bottom: 0;
			margin: 0 -24upx;
			padding: 20upx 32upx;
			display: flex;
			align-items: center;
			text-align: center;
			background-color: #fff;
			z-index: 2;
			border-top: 1px solid #ebedf0;

			.row {
				font-size: 14px;
				border: none;
			}
			
			.btn-box{
				flex: 1;
				justify-content: flex-end;
				
				.col{
					flex: none;
				}
				
			}

		}

		.dialog {
			position: fixed;
			left: 0;
			right: 0;
			top: 0;
			bottom: 0;
			background: rgba(0, 0, 0, .5);
			z-index: 2;

			.panel {
				position: absolute;
				top: 30%;
				left: 5.5%;
				width: 80%;
				padding: 20upx 32upx;
				background-color: #fff;
				z-index: 3;

				.panel-header {
					padding: 20upx 0;
					font-size: 32upx;
				}

				.panel-body {

					.dialog-text {
						flex: none;
						width: 5rem;
					}

					.row:last-child {
						border-bottom: 1px solid #ebedf0;
					}

				}

				.panel-footer {

					.row {
						justify-content: space-around;

						.col {
							border: none;
						}
					}

				}

			}

		}
		
		.operation_text {
			padding: 15upx 10upx;
			font-size: 28upx;
			width: 140upx;
			display: block;
			border-radius: 10upx;
			margin-bottom: 20upx;
			border-bottom: 1upx solid #ccc;
		}
		
		.right_text_top {
			// width: 100upx;
			padding: 30upx;
			position: absolute;
			top: 80upx;
			right: 0upx;
			background-color: rgba(0, 0, 0, 0.65);
			color: #fff;
			border-radius: 10upx;
			text-align: center;
			display: flex;
			flex-direction: column;
			justify-content: space-around;
		}
		
		.right_text_top:after {
			content: "";
			width: 0;
			height: 0;
			border: 7px solid transparent;
			border-bottom-color: rgba(0, 0, 0, 0.65);
			position: absolute;
			right: 10px;
			top: -14px;
		}

	}
	
	
</style>
